<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="father">
        <h1>Hello</h1>
        <p id="p1">p1</p>
        <p class="p2">p2</p>
    </div>

    <script>
        // 删除 DOM 节点
        // 删除节点的步骤：先获取父节点，再通过父节点删除自己
        let father = document.getElementById('father');
        // 可以传入一个子节点的 id 来删除节点
        //father.removeChild(p1);

        // 先拿到自己
        let self = document.getElementById('p1');
        // 拿到它的父节点
        let parentElement = self.parentElement;
        // 用父节点删掉自己
        parentElement.removeChild(self);

        /**
         * 删除多个节点的时候，children 是在时刻变化的，删除节点的时候一定要注意
         * */
    </script>
</body>
</html>